// 可被通用 / 复用的 class 声明于此:
// 但凡在此 定义的 class ，全局 vue 组件，都可使用

// 元素的 宽&高 充满整个父容器
.full {
  width: 100%;
  height: 100%;
}

// 元素的 宽 充满整个父容器
.full-w {
  width: 100%;
}

// 元素的 高 充满整个父容器
.full-h {
  height: 100%;
}


/**
 * 用于父元素
 * 子元素 水平&垂直 居中
 */
.center {
  display: flex;
  justify-content: center;
  align-items: center;
}

/**
 * 用于父元素
 * 子元素 水平居中
 */
 .center-x {
  display: flex;
  justify-content: center;
}

/**
 * 用于父元素
 * 子元素 垂直居中
 */
 .center-y {
  display: flex;
  align-items: center;
}



// 清浮动
.clearfix {
  &::after {
    content: '';
    display: block;
    height: 0;
    clear: both;
  }
}

// 右浮动
.float-right {
  float: right;
}

// 左浮动
.float-left {
  float: left;
}

// 6 像素的圆角
.round-6 {
  border-radius: 6px;
  overflow: hidden;
}

// 设 DOM 的入场动画为：“由小到大，渐变入场”
@keyframes slidein {
  from {
    transform: scale(0);
  }
  to {
    transform: scale(1);
  }
}
